<style rel="stylesheet/scss" lang="scss" scoped>

</style>

<template>
<div>

  <div>

    <div class="clearfix bf-top-button">
      <div class="float-l">
        <el-select v-model="datespan" size="mini" placeholder="请选择周年日期">
          <el-option v-for="item in datespanoptions" :key="item.value" :label="item.label" :value="item.value" :disabled="item.disabled">
          </el-option>
        </el-select>
        <el-button type="primary" style="margin-left: 10px">数据导出</el-button>
      </div>
      <div class="float-r">
        <div class="float-l">
          <el-input placeholder="请输入搜索内容" prefix-icon="el-icon-search" v-model="searchData" @keyup.enter.native="quickSearch">
          </el-input>
        </div>
        <div class="float-l padding-l">
          <el-button type="primary" @click="showSearch">高级筛选</el-button>
        </div>
      </div>
    </div>

    <bf-table :data="data" :setting="setting" :rowAction="rowAction" @editSubmit="editSubmit" @pageChange="pageChange" :editRules="editRules" ref="table"></bf-table>

  </div>

</div>
</template>

<script>
import request from '@/utils/request'
export default {
  data() {
    return {
      searchData: '',
      data: {
        list: [],
        total: 0
      },
      rowAction: [{
        label: '发送短信',
        click: (item) => {

        }
      }],
      setting: [{
        field: 'username',
        title: '姓名',
        type: 'text',
        searchable: true
      }, {
        field: 'userid',
        title: '用户ID',
        type: 'text',
        searchable: true
      }, {
        field: 'dept',
        title: '部门',
        type: 'text',
        searchable: true
      }, {
        field: 'post',
        title: '岗位',
        type: 'text',
        searchable: true
      }, {
        field: 'entryday',
        title: '入职日期',
        type: 'date',
        searchable: true
      }, {
        field: 'companyage',
        title: '司龄',
        type: 'text'
      }, {
        field: 'telephone',
        title: '手机号码',
        type: 'text',
        searchable: true
      }, {
        field: 'worktype',
        title: '工作性质',
        type: 'text',
        searchable: true
      }, {
        field: 'sendFlag',
        title: '是否已发送短信',
        type: 'text',
        searchable: true
      }],
      editRules: {

      },
      datespan: '',
      datespanoptions: [{
        value: 'all',
        label: '请选择'
      }, {
        value: '30d',
        label: '近30天'
      }, {
        value: 'lastmounth',
        label: '上月'
      }, {
        value: 'thismonth',
        label: '本月'
      }, {
        value: 'nextmonth',
        label: '下月'
      }, {
        value: 'thisweek',
        label: '本周'
      }, {
        value: 'today',
        label: '今天'
      }],

    }
  },
  mounted: function() {
    // this.searchList()
  },
  methods: {
    searchList() {
      request({
        url: '/hr/employeemanage/employeecare/anniversary/mock',
        method: 'get'
      }).then((response) => {
        // this.data = response.data
        this.data = {
          list: [{
            username: '用户名1',
            userid: 'useid1',
            dept: '财务部',
            post: '主管',
            entryday: '2018/06/30',
            companyage: '20',
            worktype: '全职',
            telephone: '18088888888',
            sendFlag: '是'
          }, {
            username: '用户名2',
            userid: 'useid2',
            dept: '财务部',
            post: '主管',
            entryday: '2018/06/30',
            companyage: '20',
            worktype: '全职',
            telephone: '18088888888',
            sendFlag: '是'
          }],
          total: 2
        }
      })
    },
    editSubmit(params, formType, formList) {
      // console.log(params, formType, formList)
    },
    pageChange(pageObj) {
      // console.log(pageObj)
    },
    showSearch() {
      this.$refs.table.showSearch()
    },
    showAdd() {
      this.$refs.table.showAdd()
    },
    quickSearch() {
      // const params = {
      //   userId: this.searchData
      // }
      // console.log(params)
    }
  }
}
</script>
